你有沒有曾經在網頁上發現，只要自己把滑鼠移動到某行字或是某個圖案時，滑鼠的箭頭就會變成可以點選的小手呢?!有時候甚至只是移動滑鼠網頁就會馬上產生變化，那麼我們今天就是要來講講滑鼠的變化功能。

hover

hover是最常被用在滑鼠互動功能上的屬性，我們會搭配不同的屬性來做設計，光是使用hover就可以有很多很多的變化。

hover+a

我們在介紹HTML時有說過<a>屬於超連結的標籤，那麼hover+a，顧名思義就是對於滑鼠碰到超連結時會發生的變化，舉例來說，這種搭配通常會被使用在標題的連結上，不只可以增加設計的小巧思，也能讓瀏覽者眼睛一亮。

#banner h2 a:hover{color: blue;}

上面的程式碼就是當我們的滑鼠移到id為banner的h2標題上時，標題顏色會自動變成藍色的喔!

如果是希望滑鼠移動標題上時可以迅速動一下的，我們可以對不同的屬性做設定:

#banner h2 a:hover{position: relative;
                   top: -1px;
                   left: 1px;}

這是我們用position來指定滑鼠碰到標題時，整個標籤會往右上方移動。

以上是我們對滑鼠與標題之間做的設定，那麼當滑鼠碰到的是別的物件時，又會有什麼樣的變化呢?!